<template>
  <div class="fuwuhuizong-wrap" v-if="showZcfw== 1">
      <div class="title">政策服务享受情况统计汇总表</div>
      <div class="handel">
        <div class="time">
          <el-date-picker
            v-model="value1"
            type="date"
            placeholder="选择日期">
          </el-date-picker>
        </div>
        <div class="export">
          <el-button type="success">导出</el-button>
        </div>
      </div>
      <div class="table">
          <el-table
            :data="tableData"
            style="width: 100%">
            <el-table-column
              prop="jzfwxm"
              label="救助服务项目"
              width="180">
            </el-table-column>
            <el-table-column
              prop="yixs"
              label="应享受人数"
              width="180">
            </el-table-column>
            <el-table-column
              prop="yxs"
              label="已享受人数">
            </el-table-column>
             <el-table-column
              prop="wxs"
              label="未享受人数">
            </el-table-column>
          </el-table>
      </div>
      <div class="close">

      </div>
  </div>
</template>

<script>
export default {
  name: 'fuwuhuizong',
  props:{
        parShowZcfw:{
          type:String,
          default:'0'
        }
      },
  data () {
    return {
       showZcfw:'',
        tableData: [{
            jzfwxm: '三无残疾人生活救助',
            yixs: '32',
            yxs: '23',
            wxs: '9'
          },
          {
            jzfwxm: '三无残疾人生活救助',
            yixs: '32',
            yxs: '23',
            wxs: '9'
          },
          {
            jzfwxm: '三无残疾人生活救助',
            yixs: '32',
            yxs: '23',
            wxs: '9'
          },
          {
            jzfwxm: '三无残疾人生活救助',
            yixs: '32',
            yxs: '23',
            wxs: '9'
          },
          {
            jzfwxm: '三无残疾人生活救助',
            yixs: '32',
            yxs: '23',
            wxs: '9'
          },
          {
            jzfwxm: '三无残疾人生活救助',
            yixs: '32',
            yxs: '23',
            wxs: '9'
          },
          ,
          {
            jzfwxm: '三无残疾人生活救助',
            yixs: '32',
            yxs: '23',
            wxs: '9'
          }
          ,
          {
            jzfwxm: '三无残疾人生活救助',
            yixs: '32',
            yxs: '23',
            wxs: '9'
          }
          ,
          {
            jzfwxm: '三无残疾人生活救助',
            yixs: '32',
            yxs: '23',
            wxs: '9'
          }
          ]
      
    }
  },
  watch:{
     parShowZcfw(newValue,oldValue){
        this.showZcfw = newValue;
      }
  }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
  .fuwuhuizong-wrap{
    width:800px;
    height:600px;
    position: fixed;
    left:50%;
    top:50%;
    margin-left:-410px;
    margin-top:-310px;
    z-index: 999;
    background:#fff;
    padding:20px;

  }
  .title{
    text-align: center;
    font-size:24px;
  }
  .handel{
    padding:10px 0;
    display: flex;
    justify-content: space-between;
  }
</style>
